<!DOCTYPE html>
<html lang="en">
<link>
<meta charset="UTF-8">
<title>Reading List</title>
<link rel="stylesheet" th:href="@{/style.css}"></link>
</head>
<body>
<h2>Your Reading List</h2>
<div th:unless="${#lists.isEmpty(books)}">
    <dl th:each="book : ${books}">
        <dt class="bookHeadline">
            <span th:text="${book.title}">Title</span>
            <span th:text="${book.author}">Author</span>
            (ISBN: <span th:text="${book.isbn}">ISBN</span>)
        </dt>
        <dd class="bookDescription">
                <span th:if="${book.description}"
                      th:text="${book.description}">Description</span>
            <span th:if="${book.description eq null}">
                    No description avaliable</span>
        </dd>
    </dl>
</div>
<div th:if="${#lists.isEmpty(books)}">
    <p>You have no books in your book list</p>
</div>

<hr/>

<h3>Add a book 添加一本书a</h3>
<form method="POST">
    <label for="title">Title:</label>
    <input type="text" name="title" size="50"/><br/>
    <label for="author">Author:</label>
    <input type="text" name="author" size="50"/><br/>
    <label for="isbn">ISBN:</label>
    <input type="text" name="isbn" size="15"/><br/>
    <label for="description">Description:</label>
    <textarea name="description" cols="80" rows="5"></textarea><br/>
    <input type="submit"/>
</form>
</body>
</html>